<template>
	<div class="rounded-[5px] p-[10px] overflow-hidden bg-bg-3">
		<p
			v-for="(text, index) in walletTips[typeCode]"
			:key="text + index"
			class="text-sm text-t-2 mb-1">
			<span class="mr-1">{{ index + 1 }}.</span>
			{{ $t(text) }}
		</p>
	</div>
</template>

<script lang="ts" setup>
import { computed, PropType } from 'vue'

defineProps({
	typeCode: {
		type: String as PropType<any>,
		default: ''
	}
})

const walletTips: any = computed(() => {
	return {
		Bank: [
			'walletTips.Bank.desc1',
			'walletTips.Bank.desc2',
			'walletTips.Bank.desc3',
			'walletTips.Bank.desc4',
			'walletTips.Bank.desc5',
			'walletTips.Bank.desc6',
			'walletTips.Bank.desc7',
			'walletTips.Bank.desc8'
		],
		BankOnline: [
			'walletTips.BankOnline.desc1',
			'walletTips.BankOnline.desc2',
			'walletTips.BankOnline.desc3',
			'walletTips.BankOnline.desc4',
			'walletTips.BankOnline.desc5'
		],
		BankQR: [
			'walletTips.BankQR.desc1',
			'walletTips.BankQR.desc2',
			'walletTips.BankQR.desc3',
			'walletTips.BankQR.desc4',
			'walletTips.BankQR.desc5',
			'walletTips.BankQR.desc6'
		],
		EWallet: [
			'walletTips.EWallet.desc1',
			'walletTips.EWallet.desc2',
			'walletTips.EWallet.desc3',
			'walletTips.EWallet.desc4',
			'walletTips.EWallet.desc5',
			'walletTips.EWallet.desc6'
		],
		Crypto: [
			'walletTips.Crypto.desc1',
			'walletTips.Crypto.desc2',
			'walletTips.Crypto.desc3',
			'walletTips.Crypto.desc4',
			'walletTips.Crypto.desc5',
			'walletTips.Crypto.desc6'
		],
		WithdrawBank: [
			'walletTips.WithdrawBank.desc1',
			'walletTips.WithdrawBank.desc2',
			'walletTips.WithdrawBank.desc3',
			'walletTips.WithdrawBank.desc4',
			'walletTips.WithdrawBank.desc5',
			'walletTips.WithdrawBank.desc6'
		],
		WithdrawUsdt: [
			'walletTips.WithdrawUsdt.desc1',
			'walletTips.WithdrawUsdt.desc2',
			'walletTips.WithdrawUsdt.desc3',
			'walletTips.WithdrawUsdt.desc4',
			'walletTips.WithdrawUsdt.desc5',
			'walletTips.WithdrawUsdt.desc6'
		]
	}
})
</script>
<style scoped lang="scss"></style>
